<template>
    <div class="master-box">
      <div class="master-box-commponet">
        <router-view class="animate__animated animate__fadeIn"></router-view>
      </div>
      <div class="common-footnav">
        <tabbar v-show="isTabbarShow"></tabbar>
      </div>
    </div>
</template>

<script>

import tabbar from './components/Tabbar'
import { mapState } from 'vuex'

export default {
  data () {
    return {
      datalist: []
      // isShow: true
    }
  },
  methods: {
    handleAdd () {
      this.datalist.push(this.$refs.mytext.value)
    }
  },
  components: {
    tabbar
  },
  computed: {
    ...mapState(['isTabbarShow'])
  }

}
</script>

<style lang="scss">
  * {
  padding: 0;
  margin: 0;
}
body,
html {
  height: 100%;
  background: #eee;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.mid-position {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}
.master-box {
  background: #eee;
  height: 100%;
}
a {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none;
}
.nowpl-img,
.nowpl-ul-li-pic {
  width: 66px;
  height: 91px;
}
.nowpl-ul {
  background: #fff;
}
.nowpl-ul-li {
  border-bottom: 1px solid #eee;
  padding: 15px 15px;
  display: flex;
  position: relative;
}
.nowpl-ul-li-intro {
  height: 91px;
  padding: 5px 10px;
  flex-flow: 1;
  width: 100%;
  position: relative;
  box-sizing: border-box;
}
.nowpl-ul-li-pic {
  flex-flow: 1;
}
.nowpl-isPresale {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.nowpl-isPresale:active {
  background: #ffaf40;
  color: #fff;
}
.nowpl-name {
  font-size: 16px;
  font-weight: 500;
  width: 170px;
  margin-right: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.font-grow {
  color: #9b9b9b;
  font-size: 14px;
  font-weight: 500;
}
.yahei-font {
  font-family: Microsoft YaHei, Tahoma, Helvetica, Arial, sans-serif;
}
.nowpl-grade-r {
  color: #ffaf40;
}
.nowpl-director-l {
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 180px;
  overflow: hidden;
}
.presalebtn {
    width: 50px;
    height: 28px;
    text-align: center;
    line-height: 28px;
    background: none;
    outline: none;
    border: 1px solid #ffa502;
    color: #ffa502;
    border-radius: 3px;
    font-size: 14px;
}
</style>
